<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="xdz" uri="/xdztools" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="${xdz:domain() }/css/bootstrap.min.css">
<link rel="stylesheet" href="${xdz:domain() }/css/font-awesome.min.css">
<%-- <link rel="stylesheet" href="${xdz:domain() }/css/style.min.css"> --%>
<link rel="stylesheet" href="${xdz:domain() }/css/kkpager_blue.css">
<script src="${xdz:domain() }/js/jquery.min.js"></script>
<script src="${xdz:domain() }/js/jquery.treetable.js"></script>
<script src="${xdz:domain() }/js/bootstrap.min.js"></script>
<script src="${xdz:domain() }/js/plugins/fuelux/fuelux.js"></script>
<script src="${xdz:domain() }/js/underscore-min.js"></script>
<script src="${xdz:domain() }/js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="${xdz:domain() }/js/app.js"></script>
<script src="${xdz:domain() }/js/app.plugin.js"></script>
<script src="${xdz:domain() }/js/app.data.js"></script>
<script src="${xdz:domain() }/js/kkpager.min.js"></script>
<script src="${xdz:domain() }/js/pagination.js"></script>
<script type="text/javascript" src="${xdz:domain() }/js/plugins/layer/layer.min.js"></script>
<title></title>
</head>
<body>
    <form action="../systemUserBase/list" id="systemUserBaseForm" data-parsley-validate method="post">
		<div class="panel panel-default">
			<header class="panel-heading"><h3 class="panel-title">用户管理列表</h3></header>
			<div class="panel-body">
				<div class="row">
					<div class="col-md-2">
						<input type="text" class="form-control input-sm" placeholder="ID" name="id" value="${condition.id }">
					</div>
					<div class="col-md-2">
						<input type="text" class="form-control input-sm" placeholder="用户名" name="userName" value="${condition.userName }">
					</div>
					<div class="col-md-2">
						<input type="text" class="form-control input-sm" placeholder="帐户名" name="account" value="${condition.account }">
					</div>
<!-- 					<div class="col-md-2"> -->
<!--                        	<select name="userType" id="userType" class="form-control input-sm"> -->
<!-- 							<option value="">用户类型</option> -->
<%-- 							<option value="1" <c:if test="${condition.userType == 1}">selected</c:if>>系统用户</option> --%>
<!-- 						</select> -->
<!-- 					</div> -->
					<div class="col-md-2">
                       	<select name="activeFlag" id="activeFlag" class="form-control input-sm">
							<option value="">状态</option>
							<option value="1" <c:if test="${condition.activeFlag == 1}">selected</c:if>>有效</option>
							<option value="0" <c:if test="${condition.activeFlag == 0}">selected</c:if>>已禁用</option>
						</select>
					</div>
					<div class="col-md-2">
						<button class="btn btn-primary btn-sm" type="submit">查询</button>
					</div>
					<div class="col-md-2 pull-right">
						<button type="button" class="btn btn-primary btn-sm pull-right" onclick="openAdd()">新增</button>
					</div>
				</div>
			</div>
			<div class="table-responsive scroll-wrapper">
				<table class="table table-hover table-condensed">
                    <thead>
                        <tr>
<!--                         	<th>ID</th> -->
                        	<th>头像</th>
                            <th>用户名</th>
                            <th>帐户名</th>
                            <th>用户类型</th>
                            <th>状态</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <c:forEach var="list" items="${list }">
                            <tr <c:if test="${list.activeFlag==0 }">class="text-muted"</c:if>>
<%--                            		<td>${list.id }</td> --%>
                           		<td><img alt="头像" style="width:20px" class="img-circle" src="${list.img }"></td>
                           		<td>${list.userName }</td>
                           		<td>${list.account }</td>
                           		<td>
                           			<c:if test="${list.userType=='1' }">系统用户</c:if>
                           			<c:if test="${list.userType=='3' }">供应商</c:if>
                                </td>
                           		<td>
                           			<c:if test="${list.activeFlag==1 }">有效</c:if>
                           			<c:if test="${list.activeFlag==0 }">已禁用</c:if>
                                </td>
								<td><a class="operation" href="../systemUserBase/updatePage?id=${list.id }">修改</a> | 
                           			<c:if test="${list.activeFlag==1 }"><a class="operation" href="../systemUserBase/disable?id=${list.id }">禁用</a></c:if>
                           			<c:if test="${list.activeFlag==0 }"><a class="operation" href="../systemUserBase/enable?id=${list.id }">启用</a></c:if>
                           			 |
                           			<a class="operation" href="javascript:void(0)" onclick="sendMsg('${list.id}')">发送消息</a>
								</td>
							</tr>
                        </c:forEach>
                    </tbody>
                </table>
            </div>
			<div class="panel-footer">
				<div id="kkpager"></div>
			</div>
        </div>
    </form>
  
	<script type="text/javascript">
	    function openAdd() {
	        location.href = "../systemUserBase/addPage";
	    }

	    function sendMsg(userId){
	    	layer.open({
	    		  type: 2,
	    		  title: '发送消息给用户',
	    		  shadeClose: true,
	    		  shade: 0.4,
	    		  area: ['500px', '560px'],
	    		  content: '../acMessageBase/addPage?userId='+userId 
	    		});
	    }
	    
		kkpager.generPageHtml({
		    pno : '${extQuery.pageNum }',
		    mode : 'click', //设置为click模式
		    //总页码  
		    total : '${extQuery.totalPage}',  
		    //总数据条数  
		    totalRecords : '${extQuery.total}',
		    //点击页码、页码输入框跳转、以及首页、下一页等按钮都会调用click
		    //适用于不刷新页面，比如ajax
		    click : function(n){
		        //这里可以做自已的处理
		        //...
		          this.selectPage(n);
		          toPage(n, ${extQuery.totalPage}, 'systemUserBase');
		         this.selectPage(n);
		        //处理完后可以手动条用selectPage进行页码选中切换
		
		    },
		    //getHref是在click模式下链接算法，一般不需要配置，默认代码如下
		    getHref : function(n){
		        return '#';
		    }
		
		});
    </script>
</body>
</html>
